<!--
 * Copyright (C) 2019 Eliastik (eliastiksofts.com)
 *
 * This file is part of "Simple Voice Changer".
 *
 * "Simple Voice Changer" is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * "Simple Voice Changer" is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with "Simple Voice Changer".  If not, see <http://www.gnu.org/licenses/>. -->
<!doctype HTML>
<html>
    <head>
        <title>Simple Voice Changer by Eliastik's Softs</title>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, user-scalable=no" />
        <meta name="theme-color" content="#16A085">
        <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
        <link rel="stylesheet" type="text/css" href="assets/css/bootstrap.min.css" />
        <link rel="stylesheet" type="text/css" href="assets/css/font-awesome.min.css" />
        <link rel="stylesheet" type="text/css" href="assets/css/bootstrap-slider.min.css" />
        <link rel="stylesheet" type="text/css" href="assets/css/main.css" />
        <link rel="icon" href="favicon.ico" />
        <link rel="icon" sizes="128x128" href="assets/img/favicon.png">
        <link rel="apple-touch-icon" href="assets/img/favicon.png">
        <link rel="manifest" href="manifest.json">
    </head>
    <body>
        <nav class="navbar navbar-inverse navbar-fixed-top">
            <div class="container-fluid">
                <div class="navbar-header">
                    <a class="navbar-brand" href=""><img src="favicon.ico" alt="Logo"></img> <span class="title-align">Simple Voice Changer by Eliastik's Softs</span></a>
                </div>
            </div>
        </nav>
        <div class="container well" id="containerPrincipal">
            <noscript><div class="alert alert-danger" id="noJS"><i class="fa fa-times-circle fa-fw" aria-hidden="true"></i> JavaScript est désactivé sur votre navigateur web. Cette application nécessite JavaScript pour pouvoir fonctionner. <a href="https://www.enable-javascript.com/fr/" target="_blank" class="alert-link">Cliquez ici pour savoir comment activer JavaScript</a>.<hr /><i class="fa fa-times-circle fa-fw" aria-hidden="true"></i> JavaScript is disabled on your web browser. This application requires JavaScript to work. <a href="https://www.enable-javascript.com/en/" target="_blank" class="alert-link">Click here to learn how to enable JavaScript</a>.</div></noscript>
            <div id="updateAvailable" class="alert alert-info"><strong><i class="fa fa-fw fa-info-circle"></i> <span data-i18n="update.updateAvailable">Une mise à jour de l'application est disponible</span> (<span data-i18n="update.version">version</span> <span id="appUpdateVersion">?</span> <span data-i18n="update.of">du</span> <span id="appUpdateDate">?</span><span id="appUpdateDateLocalized">?</span>). <span data-i18n="update.current">Vous disposez actuellement de la version</span> <span id="appVersion">?</span>.</strong>
            <div class="vmiddle"><a href="#" class="btn btn-sm btn-primary" id="appDownloadLink"><i class="fa fa-download fa-fw"></i> <span data-i18n="update.download">Télécharger la mise à jour</span></a> <a href="#" id="appDownloadURLGet" class="btn btn-sm btn-default" title="Obtenir l'adresse URL du téléchargement">&nbsp;<i class="fa fa-link"></i>&nbsp;</a> <a href="#" id="appUpdateChanges" class="btn btn-sm btn-default" title="Obtenir la liste des changements">&nbsp;<i class="fa fa-info-circle"></i>&nbsp;</a></div></div>
            <div class="alert alert-info" id="loading"><i class="fa fa-refresh fa-spin fa-fw"></i> <span id="loadingInfo" data-i18n="loading.loading">Chargement…</span><br /><small id="timeLoadingInfo"></small></div>
            <div class="alert alert-danger" id="errorLoading"><i class="fa fa-times-circle fa-fw" aria-hidden="true"></i> <span data-i18n="heading.connectionError">Une erreur de connexion est survenue lors du chargement de certaines données. Vérifiez votre connexion Internet puis</span> <a href="#" id="connectionErrorRetry" class="alert-link" data-i18n="heading.connectionErrorRetry">cliquez ici pour tenter de recharger les données</a>, <span data-i18n="or">ou</span> <a href="#" onclick="location.reload();" class="alert-link" data-i18n="heading.connectionErrorReload">rechargez la page</a>.<br /><span data-i18n="heading.connectionErrorInfo">Si vous utilisez cette application en local et à cause de limitations techniques, le chargement des données est bloqué, ce qui empêchera à certaines fonctionnalités de fonctionner (Vocoder, Réverbération). Dans ce cas,</span> <a href="http://www.eliastiksofts.com/simple-voice-changer/demo/" target="_blank" class="alert-link" data-i18n="heading.connectionErrorOnline">utilisez la version en ligne</a>.</div>
            <div class="alert alert-danger" id="compa"><i class="fa fa-times-circle fa-fw" aria-hidden="true"></i> <span id="compaInfo"></span></div>
            <p class="description lead" data-i18n="heading.description">Simple Voice Changer vous permet de modifier la voix d'un fichier audio ou d'un enregistrement rapidement et simplement : choisissez un fichier audio, ou enregistrez-vous, et vous pouvez modifier et enregistrer ! Tout le traitement audio se fait sur votre appareil et aucune donnée n'est envoyée sur Internet.</p>
            <div class="row" id="firstEtape">
                <div class="container-fluid">
                    <h2>1<sup data-i18n="firstStep.first">ère</sup> <span data-i18n="firstStep.title">étape : sélectionnez un fichier audio, ou enregistrez votre voix</span></h2>
                    <form class="center">
                        <div class="alert alert-danger" id="errorLoadingSelectFile"><i class="fa fa-times-circle fa-fw"></i> <span class="bold" data-i18n="firstStep.errorLoadingFile">Une erreur est survenue lors du chargement du fichier sélectionné.</span></div>
                        <button class="btn btn-primary" type="button" id="fileSelect" disabled="disabled"><i class="fa fa-file-audio-o fa-fw" aria-hidden="true"></i> <span data-i18n="firstStep.selectFile">Sélectionner un fichier audio</span></button>
                        <input id="inputFile" type="file" name="inputFile" accept="audio/*" style="display: none;">
                        <h3 data-i18n="orMaj">Ou</h3>
                        <div class="disabled-button-wrapper" id="wrapperFileRecord"><button class="btn btn-default" type="button" id="fileRecord" disabled="disabled"><i class="fa fa-microphone fa-fw" aria-hidden="true"></i> <span data-i18n="firstStep.record">Enregistrer via le micro</span></button></div>
                        <div class="language">
                            <hr />
                            <div class="form-group row">
                                <label for="languageSelect" class="col-sm-4" data-i18n="language">Langue :</label>
                                <div class="col-sm-8">
                                    <select id="languageSelect" class="form-control" rows="10" disabled></select>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <div class="row" id="firstEtapeBis">
                <div class="container-fluid">
                    <h2>1<sup data-i18n="firstStep.first">ère</sup> <span data-i18n="firstStepBis.title">étape bis : enregistrez votre voix</span></h2>
                    <div class="alert alert-danger" id="errorRecord" style="display: none;"><i class="fa fa-times-circle fa-fw"></i> <span class="bold" data-i18n="firstStepBis.error">Une erreur est survenue lors de la connexion au périphérique d'entrée. Assurez-vous d'avoir autorisé l'accès et d'avoir un périphérique d'entrée correctement connecté, puis réessayez.</span></div>
                    <div class="alert alert-info" id="waitRecord"><i class="fa fa-info-circle fa-fw"></i> <span class="bold" data-i18n="firstStepBis.info">Autorisez l'accès au microphone sur la notification qui est apparue sur votre navigateur web.</span></div>
                    <p class="description lead" data-i18n="firstStepBis.description">Vous pouvez maintenant vous enregistrer à l'aide de votre micro. Appuyez sur Démarrer pour commencer, et appuyez sur Stop dès que vous avez terminé pour commencer à modifier votre voix. Vous pouvez aussi mettre en pause l'enregistrement quand vous le voulez.</p>
                    <form class="center">
                        <div class="form-group row row-audio-input">
                            <label for="audioInput" clas="col-sm-4" data-i18n="firstStepBis.audioInput">Périphérique d'entrée :</label>
                            <div class="col">
                                <select id="audioInput" class="form-control" rows="10" disabled="disabled"></select>
                            </div>
                        </div>
                        <div class="row row-filters mt">
                            <div class="col-xs-6 border-right">
                                <div class="checkbox disabled" id="checkAudioRetourGroup" style="display: inline-block;">
                                    <span id="checkAudioRetourWrapper"><input type="checkbox" id="checkAudioRetour" disabled="disabled" /> <label for="checkAudioRetour" data-i18n="firstStepBis.audioFeedback">Retour audio</label></span>
                                </div>
                                <div class="checkbox disabled mr2" id="checkAudioGainGroup" style="display: inline-block;">
                                    <span id="checkAudioGainWrapper"><input type="checkbox" id="checkAudioGain" disabled="disabled" checked /> <label for="checkAudioGain" data-i18n="firstStepBis.autoGain">Gain automatique</label></span>
                                </div>
                            </div>
                            <div class="col-xs-6">
                                <div class="checkbox disabled mr2" id="checkAudioEchoGroup" style="display: inline-block;">
                                    <span id="checkAudioEchoWrapper"><input type="checkbox" id="checkAudioEcho" disabled="disabled" checked /> <label for="checkAudioEcho" data-i18n="firstStepBis.echoCancellation">Annulation d'écho</label></span>
                                </div>
                                <div class="checkbox disabled mr2" id="checkAudioNoiseGroup" style="display: inline-block;">
                                    <span id="checkAudioNoiseWrapper"><input type="checkbox" id="checkAudioNoise" disabled="disabled" checked /> <label for="checkAudioNoise" data-i18n="firstStepBis.noiseSuppression">Réduction de bruit</label></span>
                                </div>
                            </div>
                        </div>
                        <button class="btn btn-success" type="button" id="recordAudioPlay" disabled="disabled"><i class="fa fa-play fa-fw" aria-hidden="true"></i> <span data-i18n="firstStepBis.start">Démarrer</span></button> <button class="btn btn-default" type="button" id="recordAudioPause" disabled="disabled" style="display: none;"><i class="fa fa-pause fa-fw" aria-hidden="true"></i> <span data-i18n="firstStepBis.pause">Pause</span></button> <button class="btn btn-danger" type="button" id="recordAudioStop" disabled="disabled"><i class="fa fa-stop fa-fw" aria-hidden="true"></i> <span data-i18n="firstStepBis.stop">Stop</span></button><br />
                        <span class="bold" data-i18n="firstStepBis.duration">Durée de l'enregistrement :</span> <span id="timeRecord">00:00</span>
                        <div class="form-group mmt nmb"><button class="btn btn-danger" type="button" id="resetRecordAudio"><i class="fa fa-times fa-fw" aria-hidden="true"></i> <span data-i18n="firstStepBis.cancel">Annuler</span></button></div>
                    </form>
                </div>
            </div>
            <div class="row" id="secondEtape">
                <div class="container-fluid">
                    <form class="center">
                        <i class="fa fa-refresh fa-spin fa-fw"></i> <span class="bold" data-i18n="secondStep.loadingFile">Chargement en cours… Veuillez patienter.</span>
                    </form>
                </div>
            </div>
            <div class="row" id="thirdEtape">
                <div class="container-fluid">
                    <form class="center">
                        <button class="btn btn-primary btn-responsive" type="button" id="resetAudio"><i class="fa fa-refresh fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.otherFile">Choisir un autre fichier ou enregistrement</span></button>
                    </form>
                    <h2>2<sup data-i18n="thirdStep.nb">ème</sup> <span data-i18n="thirdStep.title">étape : modifiez et testez</span></h2>
                    <form class="center">
                        <div class="disabled-button-wrapper" id="wrapperPlay"><button class="btn btn-success" type="button" id="playAudio"><i class="fa fa-play fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.play">Lire</span></button></div> <div class="disabled-button-wrapper" id="wrapperPause" style="display: none;"><button class="btn btn-default" type="button" id="pauseAudio"><i class="fa fa-pause fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.pause">Pause</span></button></div> <div class="disabled-button-wrapper" id="wrapperStop"><button class="btn btn-danger" type="button" id="stopAudio"><i class="fa fa-stop fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.stop">Stop</span></button></div>
                        <div id="playingAudioInfos">
                            <div>
                                <input type="text" name="playAudioRange" id="playAudioRange" data-provide="slider" data-slider-min="0" data-slider-max="100" data-slider-step="1" data-slider-value="0" data-slider-tooltip="hide">
                            </div>
                        </div>
                        <div><span id="timePlayingAudio">00:00</span>/<span id="totalTimePlayingAudio">00:00</span></div>
                        <div class="checkbox" id="checkLoopPlayDiv">
                            <span id="checkLoopPlayWrapper"><input type="checkbox" id="checkLoopPlay" /> <label for="checkLoopPlay" data-i18n="thirdStep.loopPlay">Lecture en boucle</label></span>
                        </div>
                        <div class="mt">
                            <div class="mb big" id="processingModifLoader">
                                <i class="fa fa-refresh fa-spin fa-fw"></i> <span class="bold" data-i18n="thirdStep.processing">Traitement en cours… Veuillez patienter.</span>
                            </div>
                            <div class="form-group">
                                <label for="pitchRange"><i class="fa fa-microphone fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.pitch">Pitch (hauteur de la voix) :</span></label>
                                <div>
                                     <span class="slider-label left" data-i18n="thirdStep.lowPitch">Grave</span> <input type="text" name="pitchRange" id="pitchRange" data-provide="slider" data-slider-min="0.1" data-slider-max="5" data-slider-step="0.1" data-slider-value="1" data-slider-tooltip="show" data-slider-ticks="[0.1, 1, 2, 5]" data-slider-ticks-snap-bounds="0.1" ticks_positions="[0.1, 1, 2, 5]"> <span class="slider-label right" data-i18n="thirdStep.highPitch">Aigu</span>
                                </div>
                                <label for="speedRange"><i class="fa fa-forward fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.speed">Vitesse :</span></label>
                                <div>
                                    <span class="slider-label left" data-i18n="thirdStep.slow">Lent</span> <input type="text" name="speedRange" id="speedRange" data-provide="slider" data-slider-min="0.1" data-slider-max="5" data-slider-step="0.1" data-slider-value="1" data-slider-tooltip="show" data-slider-ticks="[0.1, 1, 2, 5]" data-slider-ticks-snap-bounds="0.1" ticks_positions="[0.1, 1, 2, 5]"> <span class="slider-label right" data-i18n="thirdStep.fast">Rapide</span>
                                </div>
                                <div class="row row-filters mt">
                                    <div class="col-xs-6 border-right">
                                        <div class="checkbox disabled" id="checkReverbGroup">
                                            <span id="checkReverbWrapper"><input type="checkbox" id="checkReverb" disabled="disabled" /> <label for="checkReverb" data-i18n="thirdStep.reverb">Réverbération</label></span> <a href="#" data-toggle="modal" data-target="#reverbSettings"><i class="fa fa-cog fa-fw" aria-hidden="true"></i></a>
                                        </div>
                                        <div class="checkbox" id="checkEchoGroup">
                                            <span id="checkEchoWrapper"><input type="checkbox" id="checkEcho" /> <label for="checkEcho" data-i18n="thirdStep.echo">Écho</label></span> <a href="#" data-toggle="modal" data-target="#delaySettings"><i class="fa fa-cog fa-fw" aria-hidden="true"></i></a>
                                        </div>
                                        <div class="checkbox disabled" id="checkVocodeGroup">
                                            <span id="checkVocodeWrapper"><input type="checkbox" id="checkVocode" disabled="disabled" /> <label for="checkVocode" data-i18n="thirdStep.vocoder">Vocoder (voix robotique)</label></span>
                                        </div>
                                        <div class="checkbox" id="checkPhoneGroup">
                                            <span id="checkPhoneWrapper"><input type="checkbox" id="checkPhone" /> <label for="checkPhone" data-i18n="thirdStep.phone">Appel téléphonique</label></span>
                                        </div>
                                    </div>
                                    <div class="col-xs-6">
                                        <div class="checkbox" id="checkReturnAudioGroup">
                                            <span id="checkReturnAudioWrapper"><input type="checkbox" id="checkReturnAudio" /> <label for="checkReturnAudio" data-i18n="thirdStep.returnAudio">Retourner l'audio</label></span>
                                        </div>
                                        <div class="checkbox" id="checkBitCrusherGroup">
                                            <span id="checkBitCrusherWrapper"><input type="checkbox" id="checkBitCrusher" /> <label for="checkBitCrusher" data-i18n="thirdStep.bitCrusher">Effet 8 bits</label></span>
                                        </div>
                                        <div class="checkbox" id="checkBassBoostGroup">
                                            <span id="checkBassBoostWrapper"><input type="checkbox" id="checkBassBoost" /> <label for="checkBassBoost" data-i18n="thirdStep.bassboost">Boost des basses</label></span> <a href="#" data-toggle="modal" data-target="#bassBoostSettings"><i class="fa fa-cog fa-fw" aria-hidden="true"></i></a>
                                        </div>
                                        <div class="checkbox" id="checkLowpassGroup">
                                            <span id="checkLowpassWrapper"><input type="checkbox" id="checkLowpass" /> <label for="checkLowpass" data-i18n="thirdStep.lowpass">Filtre passe-bas</label></span> <a href="#" data-toggle="modal" data-target="#lowPassSettings"><i class="fa fa-cog fa-fw" aria-hidden="true"></i></a>
                                        </div>
                                        <div class="checkbox" id="checkHighpassGroup">
                                            <span id="checkHighpassWrapper"><input type="checkbox" id="checkHighpass" /> <label for="checkHighpass" data-i18n="thirdStep.highpass">Filtre passe-haut</label></span> <a href="#" data-toggle="modal" data-target="#highPassSettings"><i class="fa fa-cog fa-fw" aria-hidden="true"></i></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="checkbox">
                                    <input type="checkbox" id="checkLimiter" checked /> <label for="checkLimiter" data-i18n="thirdStep.limiter">Limiteur (réduit la distorsion/saturation, recommandé)</label> <a href="#" data-toggle="modal" data-target="#limiterSettings"><i class="fa fa-cog fa-fw" aria-hidden="true"></i></a>
                                </div>
                                <div class="checkbox">
                                    <input type="checkbox" id="checkCompa" /> <label for="checkCompa" data-i18n="thirdStep.compatibilityMode">Mode de compatibilité (cocher si aucun son n'est diffusé)</label><br />
                                    <span class="small ml" id="compatAutoDetected" data-i18n="thirdStep.compatibilityModeAuto">Détecté et activé automatiquement</span>
                                    <span class="small ml" data-i18n="thirdStep.infosCompatibilityMode">Ce mode vous permet également de modifier le son en temps réel</span>
                                </div>
                                <div class="mt">
                                    <button class="btn btn-primary" type="button" id="validInputModify" disabled="disabled"><i class="fa fa-check fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.validate">Valider</span></button>
                                    <button class="btn btn-default" type="button" id="randomInputModify"><i class="fa fa-random fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.random">Réglages au hasard</span></button>
                                    <button class="btn btn-danger" type="button" id="resetInputModify"><i class="fa fa-refresh fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.reset">Réinitialiser</span></button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <div class="row" id="lastEtape">
                <div class="container-fluid">
                    <h2>3<sup data-i18n="lastStep.rd">ème</sup> <span data-i18n="lastStep.title">étape : enregistrez vos modifications</span></h2>
                    <p class="description lead" data-i18n="lastStep.description">N'oubliez pas de cliquer sur Valider afin de valider vos modifications avant d'enregistrer. L'enregistrement se fera sous le format WAV (non compressé).</p>
                    <form class="center">
                        <div class="mb big" id="processingSave">
                            <i class="fa fa-refresh fa-spin fa-fw"></i> <span class="bold" data-i18n="lastStep.saving">Enregistrement en cours… Veuillez patienter. Votre modification sera téléchargée sous peu.</span><br />
                            <span class="bold small"><span data-i18n="lastStep.delay">L'enregistrement se terminera dans environ</span> <span id="timeFinishedDownload">00:00</span>. <span data-i18n="lastStep.delayInfo">Il y a un délai car le mode de compatibilité est activé.</span></span><br />
                            <span class="bold small" data-i18n="lastStep.infosCompatibilityMode">Vous pouvez également modifier le son enregistré en temps réel.</span>
                            <div class="progress progress-striped progressCompact mt active">
                                <div id="progressProcessingSave" class="progress-bar" style="width: 0%"></div>
                            </div>
                            <button class="btn btn-danger btn-sm" type="button" id="cancelSaveCompaMode"><i class="fa fa-times fa-fw" aria-hidden="true"></i> <span data-i18n="lastStep.cancel">Annuler</span></button>
                        </div>
                        <div class="disabled-button-wrapper" id="wrapperSave">
                            <button class="btn btn-default" type="button" id="saveInputModify" disabled="disabled"><i class="fa fa-save fa-fw" aria-hidden="true"></i> <span data-i18n="lastStep.save">Enregistrer</span></button>
                        </div>
                    </form>
                </div>
            </div>
            <div id="bottomPage">
              <p><span data-i18n="footer.by">By</span> <a href="http://www.eliastiksofts.com" target="_blank">Eliastik</a> – <a href="http://www.eliastiksofts.com/simple-voice-changer/downloads/" target="_blank" data-i18n="footer.download">Télécharger le projet</a> – <a href="README.md" target="_blank" data-i18n="footer.readme">Fichier Lisez-moi</a> – <a href="https://github.com/Eliastik/simple-voice-changer" target="_blank" data-i18n="footer.github">Dépôt Github</a> – <a href="#" data-toggle="modal" data-target="#compatibility" data-i18n="footer.browserCompatibility">Voir les navigateurs compatibles</a></p>
              <p class="small"><span data-i18n="footer.version">Version</span> <span id="version"></span> – <span id="versionDate"></span></p>
            </div>
        </div>
        <div id="limiterSettings" class="modal fade" role="dialog">
            <div class="modal-dialog">
              <div class="modal-content">
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal">&times;</button>
                  <h4 class="modal-title" data-i18n="limiterSettings.title">Paramètres du limiteur</h4>
                </div>
                <div class="modal-body">
                    <p><span data-i18n="limiterSettings.lead">Vous pouvez régler ici les paramètres du limiteur. Les paramètres par défaut ont été testés sur de nombreux fichiers audios et fonctionnent dans la plupart des cas.</span></p>
                    <fieldset>
                        <form action="" method="post" onsubmit="setLimiterValues(); return false;" class="col-lg-12 form-horizontal">
                            <div class="form-group row">
                                <label data-i18n="limiterSettings.preGain" for="preGain" class="col-lg-4 col-form-label">Pré-gain (en dB) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="preGain" id="preGain" step="0.001">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label data-i18n="limiterSettings.postGain" for="postGain" class="col-lg-4 col-form-label">Post-gain (en dB) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="postGain" id="postGain" step="0.001">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label data-i18n="limiterSettings.attackTime" for="attackTime" class="col-lg-4 col-form-label">Temps d'attaque (en secondes) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="attackTime" id="attackTime" step="0.01" min="0">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label data-i18n="limiterSettings.releaseTime" for="releaseTime" class="col-lg-4 col-form-label">Temps de release (en secondes) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="releaseTime" id="releaseTime" step="0.01" min="0">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label data-i18n="limiterSettings.threshold" for="threshold" class="col-lg-4 col-form-label">Seuil (en dB) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="threshold" id="threshold" step="0.001">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label data-i18n="limiterSettings.lookAheadTime" for="lookAheadTime" class="col-lg-4 col-form-label">Temps de look-ahead (en secondes) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="lookAheadTime" id="lookAheadTime" step="0.001" min="0">
                                </div>
                            </div>
                        </form>
                    </fieldset>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" id="setLimiterValues"><i class="fa fa-check fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.validate">Valider</span></button>
                    <button type="button" class="btn btn-danger" id="resetLimiterValues"><i class="fa fa-refresh fa-fw" aria-hidden="true"></i> <span data-i18n="reset">Réinitialiser</span></button>
                    <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times fa-fw" aria-hidden="true"></i> <span data-i18n="close">Fermer</span></button>
                </div>
              </div>
            </div>
        </div>
        <div id="bassBoostSettings" class="modal fade" role="dialog">
            <div class="modal-dialog">
              <div class="modal-content">
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal">&times;</button>
                  <h4 class="modal-title" data-i18n="bassBoostSettings.title">Paramètres du booster des basses</h4>
                </div>
                <div class="modal-body">
                    <p><span data-i18n="bassBoostSettings.lead">Vous pouvez régler ici les paramètres du booster des basses.</span></p>
                    <fieldset>
                        <form action="" method="post" onsubmit="validateBassBoostValues(); return false;" class="col-lg-12 form-horizontal">
                            <div class="form-group row">
                                <label data-i18n="bassBoostSettings.frequencyBooster" for="frequencyBooster" class="col-lg-4 col-form-label">Fréquence de boost (booste les fréquences égales ou en dessous - en Hz) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="frequencyBooster" id="frequencyBooster" step="1" min="0">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label data-i18n="bassBoostSettings.dbBooster" for="dbBooster" class="col-lg-4 col-form-label">Gain de boost (en dB) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="dbBooster" id="dbBooster" step="0.1">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label data-i18n="bassBoostSettings.frequencyReduce" for="frequencyReduce" class="col-lg-4 col-form-label">Fréquence d'atténuation (atténue les fréquences au dessus - en Hz) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="frequencyReduce" id="frequencyReduce" step="1" min="0">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label data-i18n="bassBoostSettings.dbReduce" for="dbReduce" class="col-lg-4 col-form-label">Gain d'atténuation (en dB) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="dbReduce" id="dbReduce" step="0.1">
                                </div>
                            </div>
                        </form>
                    </fieldset>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" id="validateBassBoostValues"><i class="fa fa-check fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.validate">Valider</span></button>
                    <button type="button" class="btn btn-danger" id="resetBassBoostValues"><i class="fa fa-refresh fa-fw" aria-hidden="true"></i> <span data-i18n="reset">Réinitialiser</span></button>
                    <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times fa-fw" aria-hidden="true"></i> <span data-i18n="close">Fermer</span></button>
                </div>
              </div>
            </div>
        </div>
        <div id="highPassSettings" class="modal fade" role="dialog">
            <div class="modal-dialog">
              <div class="modal-content">
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal">&times;</button>
                  <h4 class="modal-title" data-i18n="highPassSettings.title">Paramètres du filtre passe-haut</h4>
                </div>
                <div class="modal-body">
                    <p><span data-i18n="highPassSettings.lead">Vous pouvez régler ici les paramètres du filtre passe-haut.</span></p>
                    <fieldset>
                        <form action="" method="post" onsubmit="validateHighPassValues(); return false;" class="col-lg-12 form-horizontal">
                            <div class="form-group row">
                                <label data-i18n="highPassSettings.frequencyHighPass" for="frequencyHighPass" class="col-lg-4 col-form-label">Fréquence de coupure (en Hz) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="frequencyHighPass" id="frequencyHighPass" step="1" min="0">
                                </div>
                            </div>
                        </form>
                    </fieldset>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" id="validateHighPassValues"><i class="fa fa-check fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.validate">Valider</span></button>
                    <button type="button" class="btn btn-danger" id="resetHighPassValues"><i class="fa fa-refresh fa-fw" aria-hidden="true"></i> <span data-i18n="reset">Réinitialiser</span></button>
                    <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times fa-fw" aria-hidden="true"></i> <span data-i18n="close">Fermer</span></button>
                </div>
              </div>
            </div>
        </div>
        <div id="lowPassSettings" class="modal fade" role="dialog">
            <div class="modal-dialog">
              <div class="modal-content">
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal">&times;</button>
                  <h4 class="modal-title" data-i18n="lowPassSettings.title">Paramètres du filtre passe-bas</h4>
                </div>
                <div class="modal-body">
                    <p><span data-i18n="lowPassSettings.lead">Vous pouvez régler ici les paramètres du filtre passe-bas.</span></p>
                    <fieldset>
                        <form action="" method="post" onsubmit="validateLowPassValues(); return false;" class="col-lg-12 form-horizontal">
                            <div class="form-group row">
                                <label data-i18n="lowPassSettings.frequencyLowPass" for="frequencyLowPass" class="col-lg-4 col-form-label">Fréquence de coupure (en Hz) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="frequencyLowPass" id="frequencyLowPass" step="1" min="0">
                                </div>
                            </div>
                        </form>
                    </fieldset>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" id="validateLowPassValues"><i class="fa fa-check fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.validate">Valider</span></button>
                    <button type="button" class="btn btn-danger" id="resetLowPassValues"><i class="fa fa-refresh fa-fw" aria-hidden="true"></i> <span data-i18n="reset">Réinitialiser</span></button>
                    <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times fa-fw" aria-hidden="true"></i> <span data-i18n="close">Fermer</span></button>
                </div>
              </div>
            </div>
        </div>
        <div id="delaySettings" class="modal fade" role="dialog">
            <div class="modal-dialog">
              <div class="modal-content">
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal">&times;</button>
                  <h4 class="modal-title" data-i18n="delaySettings.title">Paramètres du filtre d'écho</h4>
                </div>
                <div class="modal-body">
                    <p><span data-i18n="delaySettings.lead">Vous pouvez régler ici les paramètres du filtre d'écho.</span></p>
                    <fieldset>
                        <form action="" method="post" onsubmit="validateDelayValues(); return false;" class="col-lg-12 form-horizontal">
                            <div class="form-group row">
                                <label data-i18n="delaySettings.delaySeconds" for="delaySeconds" class="col-lg-4 col-form-label">Délai (en secondes) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="delaySeconds" id="delaySeconds" step="0.01" min="0" max="179">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label data-i18n="delaySettings.delayGain" for="delayGain" class="col-lg-4 col-form-label">Gain (en dB) :</label>
                                <div class="col-lg-8">
                                    <input type="number" class="form-control" name="delayGain" id="delayGain" step="0.001" min="0">
                                </div>
                            </div>
                        </form>
                    </fieldset>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" id="validateDelayValues"><i class="fa fa-check fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.validate">Valider</span></button>
                    <button type="button" class="btn btn-danger" id="resetDelayValues"><i class="fa fa-refresh fa-fw" aria-hidden="true"></i> <span data-i18n="reset">Réinitialiser</span></button>
                    <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times fa-fw" aria-hidden="true"></i> <span data-i18n="close">Fermer</span></button>
                </div>
              </div>
            </div>
        </div>
        <div id="reverbSettings" class="modal fade" role="dialog">
            <div class="modal-dialog">
              <div class="modal-content">
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal">&times;</button>
                  <h4 class="modal-title" data-i18n="reverbSettings.title">Paramètres du filtre réverbération</h4>
                </div>
                <div class="modal-body">
                    <p><span data-i18n="reverbSettings.lead">Vous pouvez régler ici les paramètres du filtre réverbération.</span></p>
                    <fieldset>
                        <form action="" method="post" onsubmit="validateReverbValues(); return false;" class="col-lg-12 form-horizontal">
                            <div class="form-group row">
                                <label data-i18n="reverbSettings.environmentReverb" for="environmentReverb" class="col-lg-4 col-form-label">Environnement :</label>
                                <div class="col-lg-8">
                                    <select class="form-control" name="environmentReverb" id="environmentReverb" class="disabled" disabled="disabled"></select>
                                    <p>
                                        <strong data-i18n="reverbSettings.environmentSize">Taille de l'environnement :</strong> <span id="environmentSize"></span><br />
                                        <a target="_blank" data-i18n="reverbSettings.source" href="#null" id="linkEnvironmentReverb">Source</a>
                                    </p>
                                    <p data-i18n="reverbSettings.environmentSettingsInfos">En cliquant sur Valider, l'environnement sera téléchargé temporairement sur votre appareil. Cela peut engendrer des frais.</p>
                                    <p data-i18n="reverbSettings.environmentAlreadyDownloaded" class="bold" id="environmentAlreadyDownloaded">Cet environnement a déjà été téléchargé.</p>
                                    <p data-i18n="reverbSettings.environmentAlreadyDownloadedLowQuality" class="bold" id="environmentAlreadyDownloadedLowQuality">Cet environnement a été téléchargé en une version basse qualité pour des raisons de performance. Cliquez sur Valider pour télécharger la version en meilleure qualité.</p>
                                </div>
                            </div>
                            <div class="form-group row big center" id="loadingReverb">
                                <i class="fa fa-refresh fa-spin fa-fw"></i> <span class="bold" data-i18n="reverbSettings.loading">Chargement de l'environnement en cours… Veuillez patienter.</span>
                            </div>
                            <div class="form-group row big red center" id="errorLoadingReverb">
                                <i class="fa fa-times-circle-o fa-fw"></i> <span class="bold" data-i18n="reverbSettings.error">Une erreur est survenue lors du chargement de l'environnement. Veuillez réessayer.</span>
                            </div>
                        </form>
                    </fieldset>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary disabled" disabled="disabled" id="validReverbSettings"><i class="fa fa-check fa-fw" aria-hidden="true"></i> <span data-i18n="thirdStep.validate">Valider</span></button>
                    <button type="button" class="btn btn-danger disabled" disabled="disabled" id="resetReverbSettings"><i class="fa fa-refresh fa-fw" aria-hidden="true"></i> <span data-i18n="reset">Réinitialiser</span></button>
                    <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times fa-fw" aria-hidden="true"></i> <span data-i18n="close">Fermer</span></button>
                </div>
              </div>
            </div>
        </div>
        <div id="compatibility" class="modal fade" role="dialog">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title" data-i18n="compatibility.title">Navigateurs compatibles</h4>
              </div>
              <div class="modal-body">
                <p><span data-i18n="compatibility.lead">Simple Voice Changer est compatible avec les navigateurs suivants (versions mobiles comprises) :</span>
                    <ul>
                        <li data-i18n="compatibility.chrome">Chrome, Chromium et autres navigateurs basés sur Chromium (Opera, Vivaldi, etc.)</li>
                        <li>Firefox</li>
                        <li>Safari</li>
                        <li>Microsoft Edge</li>
                    </ul>
                </p>
                <h3 data-i18n="compatibility.issuesTitle">Problèmes connus :</h3>
                <p>
                    <ul>
                        <li><span data-i18n="compatibility.issue1">La sauvegarde de la modification échoue sur Firefox et Microsoft Edge à cause d'un bug de ces navigateurs (par exemple</span> <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1031851" target="_blank" data-i18n="compatibility.issue1Link">sur Firefox</a>). <span data-i18n="compatibility.issue1Last">L'application utilise un mode de compatibilité pour tenter de passer outre ce bug, la sauvegarde peut ainsi prendre plus de temps. Ce problème ne touche pas Chrome, Chromium ainsi que les autres navigateurs basés sur Chromium.</span></li>
                        <li data-i18n="compatibility.issue2">Si la carte son de votre appareil est configurée en 192 KHz ou plus (taux d'échantillonnage), le Vocoder fonctionnera mal. Configurez-là en 92 KHz ou moins dans ce cas. Dans la plupart des cas, vous ne devriez pas vous soucier de cela car la plupart des appareils sont configurés par défaut en 44 KHz ou 48 KHz.</li>
                    </ul>
                </p>
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times fa-fw" aria-hidden="true"></i> <span data-i18n="close">Fermer</span></button>
              </div>
            </div>
          </div>
        </div>
        <script type="text/javascript" src="dist/SimpleVoiceChanger.js"></script>
    </body>
</html>
